<div id="saveMessage">
    <div class="alert alert-success alert-dismissable">
        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
        <div>Menu saved successfully!</div>
    </div>
</div>
<div class="row">
    <div class="col-md-4">
        <div class="panel-group" id="accordion">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                            Pages
                        </a>
                    </h4>
                </div>
                <div id="collapseOne" class="panel-collapse collapse in">
                    <div class="panel-body">
                        <div class="pagesItems">
                            <?php
                            foreach ($this->pages as $page) {
                                echo"<div class='checkbox'><label>";
                                echo $this->formCheckbox("page_" . $page['id'], $page['id']) . $page['pageTitle'];
                                echo"</label></div>";
                            }
                            ?>
                        </div>
                        <button id="addPages" class="btn btn-default">Add to menu</button>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                            News Article
                        </a>
                    </h4>
                </div>
                <div id="collapseTwo" class="panel-collapse collapse">
                    <div class="panel-body">
                        <div class="ArticlesItems">
                            <?php
                                                        
                            foreach ($this->articles as $article) {
                                echo"<div class='checkbox'><label>";
                                echo $this->formCheckbox("article_" . $article['nId'], $article['nId']) . $article['title'];
                                echo"</label></div>";
                            }
                            ?>
                        </div>
                        <button id="addArticles" class="btn btn-default">Add to menu</button>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a class="" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                            New Categories
                        </a>
                    </h4>
                </div>
                <div id="collapseThree" class="panel-collapse collapse">
                    <div class="panel-body">
                        <div class="categoriesItems">
                            <?php
                            foreach ($this->newsCategories as $category) {
                                echo"<div class='checkbox'><label>";
                                echo $this->formCheckbox("category_" . $category['id'], $category['id']) . $category['name'];
                                echo"</label></div>";
                            }
                            ?>
                        </div>
                        <button id="addCategories" class="btn btn-default">Add to menu</button>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseFour">
                            Links
                        </a>
                    </h4>
                </div>
                <div id="collapseFour" class="panel-collapse collapse">
                    <div class="panel-body">
                        <div class="linksItems">
                            <p>Please add (http://) to the beginning of the URL, to maintain the correct path to requested page. For the home page instead use (/) Only</p>
                            <label for="link">URL</label>
                            <input type="text" id="link" class="form-control" placeholder="Enter URL"/>
                            <label for="linkLabel">Label</label>
                            <input type="text" id="linkLabel" class="form-control" placeholder="Label"/>
                        </div>
                        <button id="addLinks" class="btn btn-default">Add to menu</button>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-8">
        <div class="panel panel-default">
            <div class="panel-body">
                <div class="panel-group" id="menuItems">
                    <h4>Menu Structure</h4>
                    <p>Drag each item into the order you prefer. Click on the item to reveal additional configuration options.</p>
                    <ol class="sortable">

                    </ol>
                    <button class="btn btn-primary" id="save">Save</button>
                </div>
            </div>
        </div>
    </div>
</div>
<?php $this->headLink()->appendStylesheet($this->baseUrl() . "/css/jquery-ui-1.10.4.custom.min.css"); ?>
<?php $this->headScript()->appendFile($this->baseUrl() . "/js/jquery-ui-1.10.4.custom.min.js"); ?>
<?php $this->headScript()->appendFile($this->baseUrl() . "/js/jquery.mjs.nestedSortable.js"); ?>
<?php $this->headScript()->appendFile($this->baseUrl() . "/js/menu.js"); ?>